<template>
    <div style="margin-left: 22px;" v-if="props.isCheck">
        <div class="lfCon1-item">
            <div class="hdTitle13">审核类型：</div>
            <el-select v-model="itemAudit1.dictSpeAuditType" placeholder="请选择" @change="changeSpeAuditType" style="width: 250px" :disabled="props.isRead">
                <el-option v-for="(item, index) in props.options1" :key="index" :label="item.name" :value="item.code" />
            </el-select>
        </div>
        <div class="lfCon1-item">
            <div class="hdTitle13">审核人：</div>
            <el-select v-model="itemAudit1.dictSpeAuditor" placeholder="请选择" style="width: 250px" @change="changeAudit" :disabled="props.isRead">
                <el-option v-for="(item, index) in props.options2" :key="index" :label="item.name" :value="item.code" />
            </el-select>
        </div>
        <div class="lfCon1-item" style="margin-left: 75px;">
            <multipleRemoteSelect :property="'forUserId'" :defaultList="itemAudit1.candidate" :placeholder="'选择用户'" :disabled="props.isRead" style="width: 250px" @save="saveMult" v-if="itemAudit1.dictSpeAuditor === '1'"></multipleRemoteSelect>
            <multipleRemoteSelect :property="'forRoleId'" :defaultList="itemAudit1.candidate" :placeholder="'选择角色'" :disabled="props.isRead" style="width: 250px" @save="saveMult" v-if="itemAudit1.dictSpeAuditor === '2'"></multipleRemoteSelect>
            <el-cascader v-model="itemAudit1.directUserCode" :options="props.options3" :props="{ value: 'code', label: 'name', children: 'children' }" style="width: 250px" @change="changeDirectUserCode" v-else-if="itemAudit1.dictSpeAuditor === '3'" :disabled="props.isRead"/>
            <!-- <el-input style="width: 250px" v-else-if="itemAudit1.dictSpeAuditor === '4'" v-model="itemAudit1.formColumn" :disabled="props.isRead" @blur="changeFormColumn"></el-input> -->
            <!-- 4人工指定（流程表单对应字段） -->
            <select-sim v-model="itemAudit1.formColumn" :property="'formColumn'" :disabled="props.isRead" :forReProcDefId="forReProcDefId"
                :defaultList="[{ 
                    id: itemAudit1.formColumn? itemAudit1.formColumn :'', 
                    name: itemAudit1.formColumn || ''
                }]" @save="saveSim1" :placeholder="'请选择'" style="width: 250px; " v-else-if="itemAudit1.dictSpeAuditor === '4'"
            />
            <select-sim v-model="itemAudit1.className" :property="'candidate'" :disabled="props.isRead"
                :defaultList="[{ 
                    id: itemAudit1.className? itemAudit1.className :'', 
                    name: itemAudit1.className || ''
                }]" @save="saveSim2" :placeholder="'请选择'" style="width: 250px; " v-else-if="itemAudit1.dictSpeAuditor === '5'"
            />
            <!-- <el-input style="width: 250px" v-else-if="itemAudit1.dictSpeAuditor === '5'" v-model="itemAudit1.className" :disabled="props.isRead"
            @blur="changeClassName"></el-input> -->
            <el-checkbox 
                v-model="itemAudit1.isAllowAddCountersign" 
                :true-value="1" 
                :false-value="0" 
                style="margin-left: 15px;"  
                @change="changeIsAllow" 
                :disabled="props.isRead"
            >
                允许手动添加会签人
            </el-checkbox>
        </div>
    </div>
</template>

<script setup lang="ts">
import multipleRemoteSelect from '@/components/remoteSelect/multiple.vue';
import selectSim from '@/components/remoteSelect/simple.vue';

interface CommonAudit {
    dictSpeAuditType: string;
    dictSpeAuditor: string;
    candidate: any[];
    directUserCode: any;
    formColumn: string;
    className: string;
    isAllowAddCountersign: number;
}
const forReProcDefId = inject('forReProcDefId',ref<number>(-1));
const props = defineProps({
    isRead: {
        type: Boolean,
        default: false
    },
    isCheck: {
        type: Boolean,
        default: false
    },
    itemAudit: {
        type: Object as () => CommonAudit,
        default: () => ({
            dictSpeAuditType: '',
            dictSpeAuditor: '',
            candidate: [],
            directUserCode: null,
            formColumn: '',
            className: '',
            isAllowAddCountersign: 1
        })
    },
    options1: {
        type: Array as () => any[],
        default: () => []
    },
    options2: {
        type: Array as () => any[],
        default: () => []
    },
    options3: {
        type: Array as () => any[],
        default: () => []
    },
    index: {
        type: Number,
        default: -1
    }
});

// 解构 props
const itemAudit1 = reactive<CommonAudit>({
    dictSpeAuditType: '',
    dictSpeAuditor: '',
    candidate: [],
    directUserCode: null,
    formColumn: '',
    className: '',
    isAllowAddCountersign: 1
});

const emit = defineEmits(['changeAudit', 'saveMult', 'changeSpeAuditType','changeDirectUserCode','changeFormColumn','changeClassName','changeIsAllow']);

const changeAudit = (val: any) => {
    const param = {
        val: val,
        index: props.index
    };
    emit('changeAudit', JSON.parse(JSON.stringify(param)));
    itemAudit1.candidate = [];
    itemAudit1.directUserCode = null;
    itemAudit1.formColumn= '';
    itemAudit1.className= '';
};

const saveMult = (msg: any) => {
    const param = {
        val: msg,
        index: props.index
    };
    emit('saveMult', JSON.parse(JSON.stringify(param)));
};
const changeSpeAuditType = (val: any) => {
    const param = {
        val: val,
        index: props.index
    };
    emit('changeSpeAuditType',  JSON.parse(JSON.stringify(param)));
};
const changeDirectUserCode = (val: any) => {
    const param = {
        val: val,
        index: props.index
    };
    emit('changeDirectUserCode',  JSON.parse(JSON.stringify(param)));
};
const changeIsAllow = (val: any) => {
    const param = {
        val: val,
        index: props.index
    };
    emit('changeIsAllow',  JSON.parse(JSON.stringify(param)));
};
const saveSim1 = (msg: any) => {
    itemAudit1.formColumn = msg.value?msg.value:'';
    const param = {
        val: itemAudit1.formColumn,
        index: props.index
    };
    emit('changeFormColumn',  JSON.parse(JSON.stringify(param)));
}
const saveSim2 = (msg: any) => {
    itemAudit1.className = msg.value?msg.value:'';
    const param = {
        val: itemAudit1.className,
        index: props.index
    };
    emit('changeClassName',  JSON.parse(JSON.stringify(param)));
}
watch(() => props.itemAudit,
    (newValue) => {
        Object.assign(itemAudit1, JSON.parse(JSON.stringify(newValue)));
    }
);
onMounted(() => {
    if (props.itemAudit) {
        Object.assign(itemAudit1, JSON.parse(JSON.stringify(props.itemAudit)));
    }
});
</script>

<style scoped lang="scss">
/* 添加必要的样式 */
</style>
